import { RouterView } from 'vue-router'
import { defineComponent, onErrorCaptured, ref, onBeforeMount } from 'vue'
import '@/assets/css/global.css'
import ErrorPage from './pages/home/error'

export default defineComponent({
  name: 'App',
  setup() {
    const errorHappened = ref<boolean>(false)
    const errorMessage = ref<string>('')

    // onErrorCaptured((err, instance, info) => {
    //   errorMessage.value = err.message;
    //   errorHappened.value = true;
    //   return false;
    // });

    function renderNormalPage() {
      return <RouterView></RouterView>
    }

    function renderErrorPage() {
      return <ErrorPage message={errorMessage.value} />
    }

    return () => <>{errorHappened.value ? renderErrorPage() : renderNormalPage()}</>
  },
})
